<title>栅格相册</title>

<link rel="stylesheet" href="/css/examples/pages/general/gallery-grid.css">

<div class="page animation-fade page-gallery-grid">
    <div class="page-content padding-0">
        <ul class="blocks no-space blocks-100 blocks-xlg-3 blocks-md-2">
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-1.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-1</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-2.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-2</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-3.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-3</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-4.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-4</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-5.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-5</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-6.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-6</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-7.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-7</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-8.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-8</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-9.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-9</h3>
                            <button type="button" class="btn btn-outline btn-inverse">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-10.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-10</h3>
                            <button class="btn btn-outline btn-inverse" type="button">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-11.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-11</h3>
                            <button class="btn btn-outline btn-inverse" type="button">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
            <li class="widget">
                <div class="cover overlay overlay-hover">
                    <img class="cover-image overlay-scale" src="/images/photos/view-12.jpg" alt="...">
                    <div class="overlay-panel overlay-fade overlay-background overlay-background-fixed text-center vertical-align">
                        <div class="vertical-align-middle">
                            <div class="widget-time widget-divider">
                                <span>2016年8月18日</span>
                            </div>
                            <h3 class="widget-title margin-bottom-20">View-12</h3>
                            <button class="btn btn-outline btn-inverse" type="button">更多信息</button>
                        </div>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</div>

<script src="/vendor/matchheight/jquery.matchHeight.min.js"></script>
